<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/js/elementui/index.css">
</head>
<body>
<div id="add">
    <el-container>
        <el-header style="width: 100%;height: auto">
            <template>
                 <span>
                 <img src="" style="width:50px;height: 50px">
            </span>
            </template>
           <template>
               <span>企业名称:&nbsp; {{company.companyName}}    </span>
           </template><br>
            <template>
               <span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 企业类型:  &nbsp; {{company.companyType}}  &nbsp;   </span>
               <span>&nbsp; 经营范围:  &nbsp; {{company.businessScope}} &nbsp;   </span>
               <span>&nbsp; 成立日期:&nbsp;   {{company.creatTime}}    &nbsp;  </span>
               <span>&nbsp; 状态:  &nbsp; {{company.companyStatus}} &nbsp;   </span>
           </template><br>
            <template>
                <span>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 申请人姓名:&nbsp;   {{company.legal}}  &nbsp; </span><br>
                <span>&nbsp;&nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 电子邮箱: &nbsp;  {{company.companyEmail}}&nbsp;   </span>
                <span>&nbsp; 固定电话: &nbsp;  {{company.fixedTel}}&nbsp;   </span>
            </template>
            <hr>
        </el-header>

        <el-container>
            <!--侧边栏-->
            <!--左侧导航-->
            <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
                <el-col :span="12"style="width: 100%">
                    <div style="background: #f0f0f0;width:100%">
                        <span style="font-size: 30px">企业产品列表</span>
                    </div>
                    <el-menu class="el-menu-vertical-demo">
                        <el-submenu index="1" >
                            <template slot="title">
                                <i class="el-icon-folder"></i>
                                <span>商品分类列表</span>
                            </template>
                            <el-submenu index="1-1">
                                <template slot="title">
                                    <i class="el-icon-folder"></i>
                                    <span>多大的</span>
                                </template>
                                <el-menu-item index="1-1-1">
                                    <i class="el-icon-tickets"></i>
                                    <span>goods</span>
                                </el-menu-item>
                            </el-submenu>
                            <el-submenu index="1-2">
                                <template  slot="title">
                                    <i class="el-icon-folder"></i>
                                    <span>定位</span>
                                </template>
                                <el-menu-item index="1-2-1">
                                    <i class="el-icon-tickets"></i>
                                    <span>goods</span>
                                </el-menu-item>
                            </el-submenu>
                            <el-submenu index="1-3">
                                <template  slot="title">
                                    <i class="el-icon-folder"></i>
                                    <span>电脑配件</span>
                                </template>
                                <el-menu-item index="1-3-1">
                                    <i class="el-icon-tickets"></i>
                                    <span>goods</span>
                                </el-menu-item>
                            </el-submenu>
                            <el-submenu index="1-4">
                                <template slot="title">
                                    <i class="el-icon-folder"></i>
                                    <span>其他</span>
                                </template>
                                <el-menu-item index="1-4-1">
                                    <i class="el-icon-tickets"></i>
                                    <span>goods</span>
                                </el-menu-item>
                            </el-submenu>
                        </el-submenu>

                    </el-menu>
                </el-col>
            </el-aside>
            <el-main>
                <el-table
                        ref="roleTable"
                        :data="products"
                        @select-all="selectAll"
                        @current-change="changeCurrent"
                        style="width: 100%">
                    <el-table-column
                            type="selection"
                            width="50">
                    </el-table-column>
                    <el-table-column label="编号">
                        <template slot-scope="scope">
                            <span>{{ scope.row.id }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="产品编号">
                        <template slot-scope="scope">
                            <span>{{ scope.row.pnumber }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="商品名称">
                        <template slot-scope="scope">
                            <span>{{ scope.row.pname }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="商品价格">
                        <template slot-scope="scope">
                            <span>{{ scope.row.pprice }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="生产日期">
                        <template slot-scope="scope">
                            <span>{{ scope.row.paddtime }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column label="审核状态">
                        <template slot-scope="scope">
                            <span v-if="scope.row.pstatus==-1" style="color: #ff4d51">未通过</span>
                            <span v-if="scope.row.pstatus==1" style="color: #13ce66">通过</span>
                        </template>
                    </el-table-column>
                </el-table>
                <!--分页-->
                <el-pagination
                        background
                        layout="prev, pager, next"
                        @current-change="loginProduct"
                        :total="total"
                        :current-page="current"
                        :page-size="pageSize">
                </el-pagination>
            </el-main>
        </el-container>
    </el-container>
</div>
</body>
<script src="/js/vue/vue.js"></script>
<script src="/js/axios/axios.min.js"></script>
<script src="/js/qs/qs.min.js"></script>
<script src="/js/elementui/index.js"></script>

<script>

    new Vue({
        el: "#add",
        data() {
            return {
                company: null,
                products: null,
                total: 0,//总条数
                current: 1,//当前条数
                pageSize: 5 //每页条数

            }


        },
        methods: {
            changeCurrent(row) {

                this.current1 = row;
                //取消所有的选择效果
                this.$refs.roleTable.clearSelection();
                //选中当前的行
                this.$refs.roleTable.toggleRowSelection(row);
            },
            //取消全选角色
            selectAll() {
                this.$refs.roleTable.clearSelection();
            },
            loginProduct(current) {
                this.current = current;
                //加载角色
                axios.get("/company/products?current=" + current).then(value => {
                    this.products = value.data.records;
                    this.total = value.data.total;
                    this.pageSize = value.data.size;
                    this.current = value.data.current;
                    console.log(value.data)
                })
            },
            loginSCompany() {
                axios.get("/company").then(value => {
                    this.company = value.data;
                    console.log(value.data)
                })
            },

        },

        mounted() {
            this.loginProduct(1)
            this.loginSCompany()

        }



    })


</script>
</html>